<nz-card style="height: calc(100vh - 90px)">

  <form nz-form [nzLayout]="'inline'" [formGroup]="searchForm">
    <nz-form-item>
      <nz-form-label>关键词</nz-form-label>
      <nz-form-control>
        <input formControlName="key" nz-input placeholder="关键词" style="width: 160px;"/>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item style="margin-right: 0;">
      <nz-form-control>
        <button nz-button nzType="primary" (click)="queryInfo()"><i nz-icon nzType="search"></i>搜索</button>
      </nz-form-control>
    </nz-form-item>
  </form>

  <nz-table
    #recordTable
    nzBordered
    class="left-table"
    [nzFrontPagination]="false"
    [nzData]="recordTableData">
    <thead>
    <tr>
      <th nzAlign="center" nzWidth="110px">山洪沟断面</th>
      <th nzAlign="center">水位</th>
      <th nzAlign="center">流量</th>
      <th nzAlign="center" nzWidth="120px">测报时间</th>
    </tr>
    </thead>
    <tbody>
    <tr *ngFor="let data of recordTable.data">
      <td nzAlign="center">{{ data.stadiaName }}</td>
      <td nzAlign="center">{{ data.waterHeight }}</td>
      <td nzAlign="center">{{ data.flux }}</td>
      <td nzAlign="center">{{ data.meaTime | date:'MM-dd HH:mm' }}</td>
    </tr>
    </tbody>
  </nz-table>

</nz-card>
